{% extends 'base.html' %}

{% block title %}
Add Inventory | Online Retail POS
{% endblock %}

{% block nav-item %}
<div class="mb-0 font-weight-bold  h5 text-gray-500 text-uppercase p-3 "> Add Inventory </div>
{% endblock %}

{% block content %}
<div class="col-lg-12 row" >
    <div class="col-lg-6" style="width: 100%">
        <div class="row mt-2">
            <form class="row col-lg-12 form mb-1 pr-0 mt-2" action="{{ request.get_full_path }}" method = "POST"  style="width: 100%;justify-content:center;">
                {% csrf_token %}
                {% for field in form %}
                <ul class="col-lg-6" ><strong style="color:black;">{{ field.label }} :</strong> {{ field }}</ul>
                {% endfor %}
                <input class="col-lg-12 btn btn-primary" style="width:100%;height:50px;margin-top:10px" type="submit" value="Submit">
            </form>
        </div>
        <div class="row col-lg-12">
            {% if notFound %}
            <div class="h3 text-center text-success mt-5 pt-5 pl-5">{{notFound}} - Barcode Not Found...<br><br>Please Ask Supervisor to add this Product </div>
            {% endif%}
        </div>
        <div class="row">
            {% if p_qty %}
            <div class="card shadow mt-5 mb-5">
                <div class="h5 text-danger m-3"> **Please do not refresh this page, as it would add quantity again to same product</div>
                <div class="card-header p-3">
                    <h6 class="m-2 font-weight-bold text-success h3">Inventory Quantity Updated - {{ obj.barcode }}</h6>
                </div>
                <div class="card-body table-responsive ">
                    <table class="table table-bordered h6 text-dark" >
                        <tbody >
                            <tr height="50px"  >
                                <td style="font-weight:bold;vertical-align: middle;">Previous Inventory Qty</td>
                                <td style="vertical-align: middle;">{{p_qty}}</td>
                            </tr>
                            <tr height="50px" >
                                <td style="font-weight:bold;vertical-align: middle;">Added Inventory Qty</td>
                                <td style="vertical-align: middle;">{{n_qty}}</td>
                            </tr>
                            <tr height="75px" >
                                <td class="h4" style="font-weight:bold;vertical-align: middle;">Total Current Inventory Qty</td>
                                <td class="h4" style="vertical-align: middle;">{{p_qty|add:n_qty}}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            {% endif %}
        </div>
    </div>
    <div class="col-lg-6 mt-2" style="width: 100%;">
        <div class="row">
            <div class="col-lg-1 row"></div>
            {% if obj %}
            <div class="col-lg-11 p-0 m-0">
                <div class="card shadow" style="width: 100%;">
                    <div class="card-header py-3">
                        <h6 class="m-2 font-weight-bold text-primary h3">Product Information - {{ obj.barcode }}</h6>
                    </div>
                    <div class="card-body " style="width:100%;">
                        <div class="table-responsive">
                            <table class="table table-striped table-bordered h6 text-gray-900" >
                                <!-- <table class="table table-hover table-bordered h1 font-weight-bold text-gray-800" style="width:100%;"> -->
                                <tbody>
                                    {% for name, value in obj.get_fields_2 %}
                                    <tr height="30px" >
                                        <td width="35%" style="font-weight:bold">{{ name }}</td>
                                        <td>{{ value }}</td>
                                    </tr>
                                    {% endfor %}
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
            {% endif %}
        
        </div>
    </div>

</div>
{% endblock %}